<template>
  <div id="app">
    <button @click="showSuccessMessage">弹出成功的提示框</button>
    <!-- 通知组件 -->
    <button @click="showNotifyDialog">显示通知的提示框</button>

     <button @click="showConfirmDialog">显示确认框</button>
  </div>
</template>

<script>
export default {
  name: "App",
  components: {},
  mounted() {
    console.log(this);
    this.$message("弹出提示框信息");
  },
  computed: {},
  data: function () {
    return {};
  },
  methods: {
    showSuccessMessage: function () {
      this.$message({
        type: "success",
        message: "成功的提示框",
      });
    },
    showNotifyDialog: function () {
      this.$notify({
        title: "通知框",
        message: "登陆成功了",
        type: "success",
        duration: 0, //不会自动关闭 默认为4.5s
      });
    },
    showConfirmDialog: function(){
      this.$confirm("你确定要取消吗","确认",{})
        .then((tehn)=>{
          this.$message("确认");
        })
        .catch((err)=>{
          this.$message({
            type:"warning",
            message:"取消",
          })
        })
    }
  },
};
</script>

<style>
</style>
